<template>
	<view>
		<!-- 
		<view class="top_search">
			<uni-search-bar :radius="100" @confirm="searchFn"></uni-search-bar>
		</view> 
		-->
		<view class="list_box">
			<checkbox-group class="uni-list" @change="checkboxChange">
				<label class="list_main" v-for="(item, index) in dataList" :key="index">
					<view><checkbox :disabled="item.allocated == 1 ? true : false" :value="JSON.stringify(item.id)" :checked="item.checked"></checkbox></view>
					<view>
						{{ item.realname }}
						<text class="" style="color: red;font-size: 10upx;" v-if="item.allocated == 1 ? true : false">{{ item.allocated == 1 ? ' 已拥有此客资' : '' }}</text>
					</view>
				</label>
			</checkbox-group>
		</view>
		<text class="true_btn" @click="submit">确定</text>
		<wzp-picker ref="wzpPicker" :mode="mode" :pickerList="pickerList" :defaultIndex="defaultIndex" @onConfirm="onConfirm"></wzp-picker>
	</view>
</template>

<script>
import wzpPicker from '@/component/wzp-picker/wzpPicker';
import sun from '@/utils/sun.js';
export default {
	components: {
		wzpPicker
	},
	data() {
		return {
			searchValue: [],
			dataList: [],
			radioItems: [
				{
					name: 'CHN',
					value: '中国',
					checked: 'true'
				}
			],
			pickerList: [],
			mode: '',
			defaultIndex: [0, 0],
			hotel: {
				hotel_text: '',
				hotel_id: ''
			},
			user_id: ' '
		};
	},
	onLoad(options) {
		this.options = options;
		this.hotel = JSON.parse(options.hotel);
	},
	onShow() {
		// #ifdef APP-PLUS
		uni.$on('globleEvent', rel => {
			this.hotel.hotel_text = rel.hotelFrom;
			this.hotel.hotel_id = rel.hotelID;
		});
		// #endif
		this.$nextTick(function() {
			this.getDataList();
		});
	},
	methods: {
		searchFn(e) {},
		onConfirm(e) {},
		getDataList() {
			let that = this;
			sun.request({
				url: '/h5/ucenter.Usercenter/getUserByHotel',
				showLoading: true,
				token: true,
				data: {
					allocate_id: that.hotel.id,
					hotel_id: that.hotel.hotel_id
				},
				success(res) {
					if (res.code == 200) {
						that.dataList = res.data.list;
					}
				},
				fail(e) {
					uni.showToast({
						icon: 'none',
						title: '服务器开小差去啦~'
					});
				}
			});
		},
		//
		checkboxChange(e) {
			this.user_id = e.detail.value;
		},
		submit() {
			let that = this;
			sun.request({
				url: '/h5/customer.customer/distribute',
				showLoading: false,
				token: true,
				data: {
					user_id: that.user_id,
					hotel_id: that.hotel.hotel_id,
					allocate_id: that.hotel.id
				},
				success(res) {
					if (res.code == 200) {
						uni.showToast({
							icon: 'success',
							title: res.msg,
							duration: 1000
						});
						setTimeout(function() {
							uni.navigateBack({
								animationType: 'pop-out',
								animationDuration: 300
							});
						}, 1000);
					} else {
						uni.showToast({
							icon: 'none',
							title: res.msg
						});
					}
				},
				fail(e) {
					uni.showToast({
						icon: 'none',
						title: '服务器开小差去啦~'
					});
				}
			});
		}
	}
};
</script>

<style lang="less">
page {
	padding: 0;
	background-color: #f4f4f4;
}

.top_search {
	width: 100%;
	display: flex;
	justify-content: center;
	background-color: #ffffff;
}

.list_box {
	width: 100%;
	padding: 30upx 0upx;
	box-sizing: border-box;

	.list_main {
		padding: 20upx 30upx;
		border-bottom: 1upx solid #f4f4f4;
		background-color: #ffffff;
		display: flex;
		justify-content: left;
	}
}

.true_btn {
	position: fixed;
	right: 40upx;
	bottom: 40upx;
	padding: 15upx 25upx;
	background: #007aff;
	color: #ffffff;
	border-radius: 20upx;
	font-size: 25upx;
}
</style>
